<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
    
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<!DOCTYPE html>
<html>
<script src="${pageContext.request.contextPath}/ckeditor/ckeditor.js"></script>
<head>
<meta charset="utf-8">
<title>修改文章</title>
<link rel="stylesheet" href="css/addArticle.css">
</head>
<body>
	<c:forEach items="${selectArticleContent}" var="selectArticleContent" >
	
	
	<form action="Article" method="post" id="article">
	
		文章标题：<input name="a_name" type="text" value="#{selectArticleContent.a_name }"/> 文章所属栏目标题：<input
			type="number" name="a_columnId"> <br>
		备注：<input type="text" name="a_remark" value="#{selectArticleContent.a_remark }">

		<!-- 阅读人数：<label name="a_pageview">${a_pageview}</label> 
			点赞数：<label name="a_love">${Article.a_love}</label><br> -->
		文章图片：<input type="file" accept="image/*" id="thePic"> <input
			type="hidden" name="a_pictureld"> <img id="imgPic"
			style="width: 100px; height: 100px">
		<!-- 文章状态：<label name="a_state">${Article.a_state}</label> -->
		<br> 文章内容：
		<textarea rows="10" cols="80" id="scpg" name="editor01">
				#{selectArticleContent.a_content}
			</textarea>
		<br> <input type="submit" class="yes" value="确认" />
	</form>
	</c:forEach>
	<script type="text/javascript">
		var editor = CKEDITOR.replace('editor01', {
			uiColor : '9370DB'
		});
		var htmlData = CKEDITOR.instances.scpg.getData();
		editor.on("fileUploadResponse",function(evt){
			console.log(evt)
			 // Prevent the default response handler.
		    evt.stop();
			var data = evt.data,
			xhr = data.fileLoader.xhr,
	        response = xhr.responseText.split( '|' );
			console.log(response)
			if(response[0]){
				 data.url = JSON.parse(response[0]).p_content;
			}
		})
	</script>
	
	
</body>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/js/jquery-1.8.3.js"></script>
<script type="text/javascript">
	$(function() {
		$('#article').submit(function() {
			var htmlData = CKEDITOR.instances.scpg.getData();
			var a_name = $("input[name='a_name']").val();
			var a_pictureld = $("input[name='a_pictureld']").val();
			var a_columnId = $("input[name='a_columnId']").val();
			var a_remark = $("input[name='a_remark']").val();
			console.log(a_pictureld)
			$.post("article", {
				"a_name" : a_name,
				"a_content" : htmlData,
				"picture.p_id" : a_pictureld,
				"a_columnId" : a_columnId,
				"a_remark" : a_remark

			}, function(resp) {
				if (resp) {

					extraPlugins = 'save';
				}
			});
			return false;
		});

		//文件选择框事件
		$('#thePic').change(function(event) {
			//得到文件选择框选择的图片
			var file = event.target.files[0];
			console.log(file)
			var formdata = new FormData();
			formdata.append('upload', file);

			$.ajax({
				url : 'upload',
				type : 'POST',
				data : formdata,
				dataType : 'JSON',
				cache : false,
				processData : false,
				contentType : false,
				success : function(resp) {
					$("input[name='a_pictureld']").val(resp.p_id);
					$("#imgPic").attr('src', resp.p_content);
				}
			})
		})
	});
</script>
</html>